<template>
  <div style="width: 100%; display: inline-block;">
    <el-statistic @finish="hilarity" :value="deadline" time-indices title="支付倒计时" style=" margin: 120px 0; ">
    </el-statistic>

    <el-descriptions title="订单信息:" :span="1" style="margin: 0 100px" border>
      <el-descriptions-item label="订单号">{{ orderNo }}</el-descriptions-item>
      <el-descriptions-item label="支付金额">￥{{ dona_money }}</el-descriptions-item>
      <el-descriptions-item label="下单用户名">{{ username }}</el-descriptions-item>
    </el-descriptions>
    <div class="flex">
      <el-button @click="Cancel" type="danger" plain>取消订单</el-button>
      <el-button @click="PayOrder" type="success" plain>确认支付</el-button>
    </div>


  </div>
</template>
  
<script>
import request from "@/utils/request" //引入request（包装好的axios）来发起请求
export default {
  name: 'goods',
  data: function () {
    return {
      deadline: Date.now() + 1000 * 1 * 60,
      dona_money: "",
      orderNo: "",
      user_id:"",
      productID:"",
      notShow:false
    }
  },
  created() {
    console.log(this.$route.params, '=============================')
    if (this.$route.params.dona_money) {
      this.dona_money = this.$route.params.dona_money
      sessionStorage.setItem("dona_money", this.dona_money);
    } else {
      this.dona_money = sessionStorage.getItem("dona_money")
    }
    if (this.$route.params.orderNo) {
      this.orderNo = this.$route.params.orderNo
      sessionStorage.setItem("orderNo", this.orderNo);
    } else {
      this.orderNo = sessionStorage.getItem("orderNo")
    }  if (this.$route.params.user_id) {
      this.user_id = this.$route.params.user_id
      sessionStorage.setItem("user_id", this.user_id);
    } else {
      this.user_id = sessionStorage.getItem("user_id")
    }if (this.$route.params.productID) {
      this.productID = this.$route.params.productID
      sessionStorage.setItem("productID", this.productID);
    } else {
      this.productID = sessionStorage.getItem("productID")
    }
    this.getTime();
  },
  methods: {
    getTime() {
      let that = this
      request({
        url: '/api/order/overTime',
        method: "get",
        params: {
          num: that.orderNo,
        }
      })
        .then(function (res) {
          
          let s = res.data
          that.deadline = Date.now() + 1000 * 1 * s
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    hilarity() {
       window.location.href = 'http://www.gaosheng.com/#/goods/details?goodsId='+this.productID
      if(!this.notShow){
        this.$notify({
        title: '提示',
        message: '时间已到，订单已取消',
        duration: 0,

      });
      }
    },

    Cancel() {
      request({
        url: "/api/order/Cancel",
        method: "get",
        params: {
          num: this.orderNo}
      })
        .then(res => {
          this.notifySucceed(res.msg)
          window.location.href = 'http://www.gaosheng.com/#/goods/details?goodsId='+this.productID
          this.notShow=true
        });

    },



    // Cancel() {
    //   let that = this
    //   request({
    //     url: '/api/order/Cancel',
    //     method: "get",
    //     params: {
    //       num: that.orderNo,
    //     }
    //   })
    //     .then(function (res) {
    //       this.notifySucceed(res.msg)
    //       window.location.href = 'http://www.gaosheng.com/goods/details?productID='+this.productID
          
    //     })
    //     .catch(function (error) {
    //       console.log(error);
    //     });

    // },
    PayOrder() {
      // let url='http://api.gaosheng.com/api/order/pay/alipay?dona_money=' +
      //   this.dona_money + '&dona_id=001&order_num=' + this.orderNo + '&user_id=' + this.user_id
      // window.open(url)
      window.location.href = 'http://api.gaosheng.com/api/order/pay/alipay?dona_money=' +
        this.dona_money + '&dona_id=001&order_num=' + this.orderNo + '&user_id=' + this.user_id
    }

  }
}
</script>
  
<style scoped>
.flex {
  margin-top: 130px;
  display: flex;
  justify-content: space-around;
}
</style>